module Mix.Views {
    /*
    * Guide
    * 游戏指引
    */
    export class Guide extends Mix.Views.BaseViews {
        // eui
        public guideImg:eui.Image;
        public guideLabel:eui.Label;
        public topRect:eui.Rect;
        public leftRect:eui.Rect;
        public rightRect:eui.Rect;
        public bottomRect:eui.Rect;
        
        // 
        public guideId:number;
        public scriptObj:guideScript;
        private _targetObj:egret.DisplayObject;
        private _targetGlobalPos:egret.Point;
        private _oldGlobalPos:egret.Point;
        private _targetParent:any;
        
        constructor(){
            super("GuideSkin");
        }
        
        public initCreationComplete(){
            super.initCreationComplete();
            this._targetGlobalPos = new egret.Point;
            this._oldGlobalPos = new egret.Point;
            this.closeView();
        }
        
        /**
         * loadGuideScript
         * 读取引导脚本
         */
        public loadGuideScript(id:number,targetObj:egret.DisplayObject) {
            this.guideId = id;
            if(this.findGuideComplete()){
                return
            }

            this._targetObj = targetObj;

            // console.log(RES.getRes("guide_" + id + "_js"));
            
            this.scriptObj = eval(RES.getRes("guide_" + id + "_js"));

            // RES.getResByUrl('resource/script/guide/guide_' + id + '.js',(data,url)=>{
            //     this.scriptObj = eval(data);
                
            //     this.onLoadGuideScript();
            // },this,RES.ResourceItem.TYPE_TEXT);
            this._targetObj.addEventListener(egret.TouchEvent.TOUCH_TAP,this.onTouchTargetArea,this);

            this.onLoadGuideScript();
        }
        
        /**
         * onLoadGuideScript
         * 读取引导脚本 完成
         */
        private onLoadGuideScript(){
            // console.log("执行 引导脚本");
            
            this.openView();
            
            this.scriptObj.startFunc();
            
            //提取目标 全局坐标
            this._targetGlobalPos = this._targetObj.parent.localToGlobal(this._targetObj.x,this._targetObj.y);
            //设置guide阴影的位置
            this.setRect(this._targetGlobalPos.x,this._targetGlobalPos.y,this._targetObj.width,this._targetObj.height);
   
            //todo 如果有文字说明 设置文字
            if(this.scriptObj.guideLabel && this.scriptObj.guideLabel !== ""){
                this.guideLabel.text = this.scriptObj.guideLabel;
                this.guideLabel.x = this.scriptObj.guideLabelPos.x;
                this.guideLabel.y = this.scriptObj.guideLabelPos.y;
                this.guideLabel.visible = true;
            }else{
                this.guideLabel.visible = false;
            }
            
            //todo 如果有图片 设置图片
            if(this.scriptObj.guideImg && this.scriptObj.guideImg !== ""){
                this.guideImg.source = this.scriptObj.guideImg;
                this.guideImg.x = this.scriptObj.guideImgPos.x;
                this.guideImg.y = this.scriptObj.guideImgPos.y;
                this.guideImg.visible = true;
            }else{
                this.guideImg.visible = false;
            }
            
        }

        /**
         * setRect
         * 设置4个阴影层
         */
        private setRect(x:number,y:number,width:number,height:number){
            // console.log(this.width,this.height);
            // console.log(this.targetRect.x,this.targetRect.y,this.targetRect.width,this.targetRect.height);
            // console.log(this.stage.stageWidth,this.stage.stageHeight);
            width *= this._targetObj.scaleX;
            height *= this._targetObj.scaleY;

            x -= this._targetObj.anchorOffsetX;
            y -= this._targetObj.anchorOffsetY;
            
            this.topRect.top = 0;
            this.topRect.left = 0;
            this.topRect.right = 0;
            this.topRect.bottom = this.height - y;
            
            this.leftRect.top = y;
            this.leftRect.left = 0;
            this.leftRect.right = this.width - x;
            this.leftRect.bottom = this.height - y - height;
            
            this.rightRect.top = y;
            this.rightRect.left = x + width;
            this.rightRect.right = 0;
            this.rightRect.bottom = this.leftRect.bottom;
            
            this.bottomRect.top = y + height;
            this.bottomRect.left = 0;
            this.bottomRect.right = 0;
            this.bottomRect.bottom = 0;
        }
        
        /**
         * onTouchTargetRect
         * 点击了目标区域
         * 给目标按钮绑定此方法，当step达到最大值后移除此方法
         * 此间会执行引导脚本的各步骤方法
         */
        private onTouchTargetArea(e:egret.TouchEvent){
            
            // console.log("enter!!");
            
            //移除点击方法
            this._targetObj.removeEventListener(egret.TouchEvent.TOUCH_TAP,this.onTouchTargetArea,this);
            
            //标记完成
            this.setGuideComplete();

            //关闭引导界面
            this.closeView();

            //执行脚本方法
            this.scriptObj.onTapFunc();
        }

        /**
         * 设置 引导完成
         */
        public setGuideComplete(){
            //取出数据
            var save:string = egret.localStorage.getItem("majiang_GuideCompleteList");
            if(!save){
                save = "" +　this.guideId;;
            }else{
                 save += "," + this.guideId;
            }
            egret.localStorage.setItem("majiang_GuideCompleteList",save);
        }

        /**
         * 查找 引导是否完成
         */
        public findGuideComplete():boolean{
            var save:string = egret.localStorage.getItem("majiang_GuideCompleteList");
            if(!save){
                return false;
            }

            if(save.indexOf(this.guideId.toString()) < 0){
                return false
            }else{
                return true
            }
        }
    }
    
    interface guideScript {
        info:string;  //脚本描述 （自己看的）
        guideLabel:string; //给玩家的引导文字说明
        guideLabelPos:egret.Point; //{x:0 , y:0}
        guideImg:string; //引导说明图片
        guideImgPos:egret.Point; //{x:0 , y:0}
        startFunc:Function; //引导开始前 执行
        onTapFunc:Function; //引导 点击目标后触发执行
    }
}